<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="pragram" content="no-cache"/>
    <meta http-equiv="cache-control" content="no-cache, must-revalidate"/>
    <meta http-equiv="expires" content="0"/>
    <meta name="renderer" content="webkit"/>
    <meta name="viewport" content="width=device-width,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
    <title>通话列表</title>

    <link rel="stylesheet" href="/assets/css/lib/bootstrap.min.css">
    <link rel="stylesheet" href="/assets/css/lib/pagination.css">

    <link rel="stylesheet" href="/assets/css/common.css">
    <link rel="stylesheet" href="/assets/css/converse_list.css">

</head>
<body>

<div  id="cms">
    <jsp:include page="title_bar.jsp"/>
    <jsp:include page="tab_bar.jsp"/>
    <div class="cms-content">
        <div class="current-place">
            <div class="place-title">当前位置:</div>
            <div class="place-val">首页/律师管理/通话列表</div>
        </div>
        <div class="table-box">
            <table class="table table-bordered">
                <thead>
                <tr>
                    <th>客户姓名</th>
                    <th>发起方</th>
                    <th>发起场景</th>
                    <th>发起时间</th>
                    <th>通话时长</th>
                    <th>通话结果</th>
                    <th>通话有效性</th>
                    <th>录音</th>
                </tr>
                </thead>
                <tbody id="list">

                </tbody>

                <script type="text/html" id="list_tmpl">
                    <!for(k in result){!>
                    <tr>
                        <td> <!if(result[k].uname!=null){!> <a href="../user/showDetail?uid=<!=result[k].userid!>"><!=result[k].uname!></a><!}!></td>
                        <td><!=result[k].initiator==0?"客户":"律师"!></td>
                        <td><!=result[k].proName ==null ?'':result[k].proName!></td>
                        <td><!=result[k].startTime!></td>
                        <td><!=result[k].calledDuration!></td>
                        <td><!=backCallState(result[k].callStatus,result[k].rejectStatus)!></td>
                        <td><!=result[k].isEffective==0?'无效':'有效'!></td>
                        <td>
                            <div class="audio-btn" onclick="openAudio('<!=JSON.stringify(result[k])!>')">
                                <img src="/assets/images/audio.png" alt="">
                                <span>录音</span>
                            </div>
                        </td>
                    </tr>
                   <!}!>
                </script>

            </table>

            <div class="table-bottom clearfix">
                <div id="Pagination" class="pagination"><!-- 这里显示分页--></div>
            </div>
        </div>

    </div>
</div>

</div>
<div class="cms-modal-lg" id="audio-detail">
    <div class="cms-modal-dialog">
        <div class="cms-modal-title">
            通话详情
            <div class="cms-modal-close">x</div>
        </div>
        <div class="cms-madal-content" id="call">

        </div>

        <script type="text/html" id="call_tmpl">

            <div class="table-box">
                <table class="table table-bordered">

                    <tr>
                        <td class="left-title">发起方</td>
                        <td class="right-content"><!=data.initiator==0?'客户':'律师'!></td>
                        <td class="left-title">通话时长</td>
                        <td class="right-content"><!=data.calledDuration!>秒</td>
                        <td class="left-title">是否有效</td>
                        <td class="right-content"><!=data.isEffective==0?'无效':'有效'!></td>
                        <td class="left-title">通话质量</td>
                        <td class="right-content"><!=data.calledDuration>=${confValue}?'优质':'普通'!></td>
                    </tr>
                    <tr>
                        <td class="left-title">客户姓名</td>
                        <td class="right-content"><!=data.uname==null?'':data.uname!></td>
                        <td class="left-title">客户电话</td>
                        <td class="right-content"><!=data.uphone==null?'':data.uphone!></td>
                        <td class="left-title">律师姓名</td>
                        <td class="right-content"><!=data.lawyername!></td>
                        <td class="left-title">律师电话</td>
                        <td class="right-content"><!=data.lawyerPhone!></td>
                    </tr>
                    <tr>
                        <td class="left-title">发起时间</td>
                        <td class="right-content" colspan="3"><!=data.startTime!></td>

                        <td class="left-title">通话结果</td>
                        <td class="right-content" colspan="3"><!=backCallState(data.callStatus,data.rejectStatus)!></td>
                    </tr>
                </table>
            </div>


            <div class="cms-modal-bottom" >
                <audio src="<!=data.voiceUrl!>" controls>

                </audio>
            </div>

        </script>



    </div>
</div>
</body>
<script type="text/javascript">
    var lawyerid='${lawyerId}'
</script>
<script type="text/javascript" src="/assets/js/lib/jquery-1.12.3.js"></script>
<script type="text/javascript" src="/assets/js/lib/bootstrap.min.js"></script>
<script type="text/javascript" src="/assets/js/lib/modal.js"></script>
<script type="text/javascript" src="/assets/js/lib/cmsmodal.js"></script>

<script type="text/javascript" src="/assets/js/lib/distpicker.data.js"></script>
<script type="text/javascript" src="/assets/js/lib/distpicker.js"></script>
<script type="text/javascript" src="/assets/js/lib/jquery.pagination.js"></script>

<script type="text/javascript" src="/assets/js/lib/My97DatePicker/WdatePicker.js"></script>
<script type="text/javascript" src="/assets/js/common.js"></script>
<script type="text/javascript" src="/assets/js/communal/template.js"></script>
<script type="text/javascript" src="/assets/js/converse_list.js"></script>
